<!DOCTYPE html>
<!--suppress ALL-->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>反馈列表页</title>
    <link rel="stylesheet" th:href="@{/assets/css/styles.css}">
    <link rel="stylesheet" th:href="@{/assets/css/colors.css}">
    <script th:src="@{/assets/js/jquery.min.js}"></script>
    <script th:src="@{/assets/js/popper.min.js}"></script>
    <script th:src="@{/assets/js/bootstrap.min.js}"></script>
    <script th:src="@{/assets/js/custom.js}"></script>
    <script th:src="@{/assets/js/daterangepicker.js}"></script>
    <script th:src="@{/assets/js/dropzone.js}"></script>
    <script th:src="@{/assets/js/imagesloaded.js}"></script>
    <script th:src="@{/assets/js/ion.rangeSlider.min.js}"></script>
    <script th:src="@{/assets/js/jquery.magnific-popup.min.js}"></script>
    <script th:src="@{/assets/js/lightbox.js}"></script>
    <script th:src="@{/assets/js/markerclusterer.js}"></script>
    <script th:src="@{/assets/js/moment.min.js}"></script>
    <script th:src="@{/assets/js/morris.min.js}"></script>
    <script th:src="@{/assets/js/raphael.min.js}"></script>
    <script th:src="@{/assets/js/select2.min.js}"></script>
    <script th:src="@{/assets/js/slick.js}"></script>
    <script th:src="@{/assets/js/slider-bg.js}"></script>
    <script th:src="@{/assets/js/script.js}"></script>
</head>
<body>
    <!-- 复用首页头部 -->
    <header th:replace="index::header"></header>
    <div class="container" style="margin-bottom: -20px; height: 695px; overflow: auto">
        <!-- 个人信息页 -->
        <section class="p-0">
            <div class="container-fluid p-0">
                <div class="row">
                    <!-- 左侧导航栏 -->
                    <div th:replace="sidebar::left"></div>
                    <!-- 右侧内容显示 -->
                    <div class="col-lg-9 col-md-8 col-sm-12"  style="height:695px;overflow:auto;">
                        <div class="dashboard-body">
                            <table class="property-table-wrap responsive-table bkmark" style="margin-top: -10px;margin-bottom: -30px;">
                                <tbody>
                                    <tr>
                                        <th><i class="fa fa-file-text"></i>反馈列表</th>
                                        <th th:if="${loginUserData.role == 'owner'}" style="width: 8%;">操作</th>
                                    </tr>
                                    <tr th:each="feedback:${feedbackList}">
                                        <td class="dashboard_propert_wrapper">
                                            <div style="margin-left: 20px;width: 100%">
                                                <div class="row" style="width: 100%">
                                                    <h4 th:text="${feedback.title}"></h4>
                                                    <p style="margin-left: 50px;" th:text="${#calendars.format(feedback.createTime, 'yyyy-MM-dd')}">创建时间</p>
                                                    <p style="margin-left: 50px;">
                                                    <span th:switch="${feedback.status}">
                                                        <span class="text-warning" th:case="0">待处理</span>
                                                        <span class="text-success" th:case="1">已处理</span>
                                                    </span>
                                                        <span style="margin-left: 50px;" th:text="${feedback.contactName}" th:if="${loginUserData.role != 'customer'}"></span>
                                                        <span th:text="${feedback.contactEmail}" th:if="${loginUserData.role != 'customer'}"></span>
                                                    </p>
                                                </div>
                                                <div class="row"style="width: 100%">
                                                    <p th:text="'房屋地址：' + ${feedback.houseOrder.house.address} "></p>
                                                </div>
                                                <div class="row"style="width: 100%">
                                                    <p th:text="'反馈内容：' + ${feedback.content} "></p>
                                                </div>
                                                <div class="row"style="width: 100%">
                                                    <p th:if="${feedback.status == 1}" th:text="'回复内容：' + ${feedback.reply}"></p>
                                                </div>
                                            </div>
                                        </td>
                                        <td th:if="${loginUserData.role == 'owner'}">
                                            <div>
                                                <a href="javascript:void(0)" class="delete" data-toggle="modal" data-target="#reply" th:onclick="|showReplyModal(${feedback.id})|">回复反馈</a>
                                                <div class="modal" id="reply">
                                                    <div class="modal-dialog">
                                                        <header>
                                                            <div class="hm_nav">
                                                                <h3 class="hm_nav_title">回复反馈</h3>
                                                                <span class="mod-close" data-dismiss="modal"><i class="ti-close"></i></span>
                                                            </div>
                                                        </header>
                                                        <div class="modal-content">
                                                            <div class="modal-body">
                                                                <form id="replyForm" th:action="@{/feedback/reply}" method="post">
                                                                    <div class="row">
                                                                        <input type="text" id="feedbackId" name="feedbackId" hidden="hidden">
                                                                        <div class="col-lg-12 col-md-12">
                                                                            <div class="form-group">
                                                                                <label>回复内容</label>
                                                                                <div class="input-with-icon">
                                                                                    <textarea class="form-control" id="replyInfo" name="reply"></textarea>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                        <div class="col-lg-12 col-md-12">
                                                                            <div class="form-group">
                                                                                <label>状态</label>
                                                                                <div class="input-with-icon">
                                                                                    <select id="statusInfo" name="status" class="form-control">
                                                                                        <option value="1">已处理</option>
                                                                                        <option value="0">未处理</option>
                                                                                    </select>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="form-group">
                                                                        <button type="submit" class="btn btn-md full-width pop-login bg-2">回复提交</button>
                                                                    </div>
                                                                </form>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                            <!-- 分页 -->
                            <nav class="mt-5" th:if="${page.rows>0}" th:replace="index::pagination"></nav>
                        </div>
                    </div>

                </div>
            </div>
        </section>
    </div>
    <!-- 复用首页底部 -->
    <div th:replace="index::footer"></div>
    <script>
        $(function () {
            $("#myFeedbackInfo").attr("class", "active");
            $("#feedbackDeel").attr("class", "active");
        })
    </script>
</body>
</html>